<template>

	<div>
		<toubu></toubu>
		<div class="banner">
			<div class="tab-warry">
				<div class="tab">
					<div class="tab-left">正在热映</div>
					<div class="tab-right">即将上映</div>
				</div>

				<div class="Movie-list" v-for="mover in list">
					<img :src="mover.poster.origin"/>
					<div class="list-brief">
						<div class="list-name">
							<div class="list-left">{{mover.name}}</div>
							<div class="list-right">{{mover.grade}}</div>
						</div>
						<div class="list-slogan">{{mover.intro}}</div>
						<div class="renshu">
							<div class="renshu-left"><span>{{mover.cinemaCount}}</span>家影院上映</div>
							<div class="renshu-right"><span>{{mover.watchCount}}</span>人购票</div>
						</div>
						<!--<div><span>{{mover.cinemaCount}}</span>家影院上映　　<span>{{mover.watchCount}}</span>人购票</div>-->
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import Toubu from './toubu.vue';
	import $ from 'jquery'
	export default {
		data: function() {
			return {
				list: []
			}
		},
		components: {
			Toubu
		},
		mounted: function() {
			var url = 'http://localhost:3000/list?time=' + new Date().getTime();
			var chat = this;
			$.get(url, function(res) {
				console.log(res)
				chat.list = res.data.films
			})
		}
	}
</script>

<style>

</style>